/**
 * 网页WebView
 * @author Jim
 * @date 2019/12/18
 * @update 2020/01/18
 */
import React, {PureComponent} from 'react';
import {WebView} from 'react-native-webview';
// import Header from '../../components/Header';
import Navigation from '../../utils/Navigation';
import {getVideoUrl} from '../../utils/videoUtil';
import {StatusBarHeight} from '../../global/Device';
import Orientation from 'react-native-orientation';
import {
  StyleSheet,
  StatusBar,
  Text,
  TouchableOpacity,
  View,
  Image,
} from 'react-native';
export default class Index extends PureComponent {
  constructor(props) {
    super(props);
    const {uri, title} = this.props.navigation.state.params;
    // const temp = "http://jx.quanmingjiexi.com/?url="+uri;
    const temp = getVideoUrl(uri);
    // const  temp = "https://tool.bitefu.net/video/?url="+uri
    // console.log("temp =======>"+temp);
    this.state = {
      url: temp,
      title: title,
    };
    Orientation.lockToLandscape();
  }

  componentWillUnmount() {
    Orientation.lockToPortrait();
  }

  render() {
    return (
      <>
        <WebView
          ref={(webView) => (this.webView = webView)}
          style={{flex: 1}}
          source={{uri: this.state.url}}
          startInLoadingState={true}
          //onNavigationStateChange={(e) => this.onChange(e)}
        />
      </>
    );
  }
}
const styles = StyleSheet.create({
  header: {
    position: 'relative',
    height: 36 + StatusBarHeight + 10,
    flexDirection: 'row',
    paddingTop: StatusBarHeight + 5,
    paddingBottom: 5,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#F4F4F4',
    zIndex: 10000,
  },
  header_back: {
    marginLeft: 15,
    marginRight: 5,
  },
  header_body_text: {
    flex: 1,
    fontSize: 18,
    fontWeight: 'bold',
    paddingLeft: 10,
  },
  btn: {
    width: 80,
    height: 30,
    backgroundColor: 'red',
    position: 'absolute',
    bottom: 100,
    right: -10,
    zIndex: 100,
    borderRadius: 10,
  },
  btn1: {
    width: 80,
    height: 30,
    backgroundColor: 'blue',
    position: 'absolute',
    bottom: 50,
    right: -10,
    zIndex: 100,
    borderRadius: 10,
  },
  video: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
  },
});
